import {View, Image, Text} from '@tarojs/components';
import React from 'react';
import Taro from '@tarojs/taro';
import {AtIcon, AtRate} from 'taro-ui';
import {TARO_ENV} from "../../../constants/api";
import {GetRequest} from "../../../utils/tools";
import './enter-store.scss';

interface EnterStoreType {
  siteInfo: any
  stars: 0
}

const EnterStore: React.FC<EnterStoreType> = ({siteInfo, stars}) => {
  if (siteInfo && Object.keys(siteInfo).length === 0) {
    return <View />
  }

  const checkJump = ()=> {
    if (Taro.getCurrentInstance().router.params.pkeys) {
      Taro.showToast({ title: 'pc端此功能只做模拟，具体请前往移动端体验！', duration: 3500, icon: 'none' })
      return false
    }
    return true
  }

  let name = ''
  if (siteInfo && siteInfo.name) {
    for(let i=0,j=1; i<siteInfo.name.length; i++, j++) {
      if(j&&j%12=== 0) {
        name += siteInfo.name[i]+'<br />'
      } else {
        name +=  siteInfo.name[i]
      }
    }
  }

  return (
    <View className='store-info-box' onClick={() => {
      if (checkJump()) {
        let mpkey = ''
        const uInfo = Taro.getStorageSync('user') || ''
        if (uInfo && uInfo.mpkey && uInfo.mpkey !== 'undefined') {
          mpkey = uInfo.mpkey
        }
        let url = ''
        if (process.env.P_ENV === 'vc' || process.env.P_ENV === 'kunxin') {
          url = '/other/shop/info?uuid=' + siteInfo.uuid + '&mpkey=' + mpkey
        } else {
          url = '/other/store/store?sid=' + siteInfo.uuid + '&mpkey=' + mpkey
        }
        Taro.navigateTo({url: url})
      }
    }}
    >
      <View className='head'>
        {siteInfo.logo && <Image className='img' src={siteInfo.logo + `${TARO_ENV !== 'h5' ? '?x-oss-process=image/resize,w_40' : ''}`} mode={`${TARO_ENV === 'h5' ? 'scaleToFill' : 'widthFix'}`} />}
        <View className='span'>
          <Text className='span-title'>{name}</Text>
          {(process.env.P_ENV === 'vc' || process.env.P_ENV === 'kunxin') && !!stars && siteInfo.application_open_comment == 1 && <View className='star'>
            <AtRate
              className={`star-rate ${process.env.TARO_ENV !== 'h5' ? 'star-rate-weapp' : ''}`}
              value={stars}
              size={14}
            />
            <Text className='star-scores'>{stars}分</Text>
          </View>}
        </View>
      </View>
      <View className='a-box'>
        <View>进去逛逛</View><AtIcon customStyle='display:block;' value='chevron-right' size='11' />
      </View>
    </View>
  )
}

export default EnterStore
